<script setup>
import { onMounted, onUnmounted, ref } from 'vue';
import { EventBus } from '@/views/game/EventBus';
import StartGame from '@/views/game/game01/Main'

const scene = ref();
const game = ref();
// vue3中的，用来声明和处理自定义事件,事件相应是在index.vue中使用PhaserGame时消费的
const emit = defineEmits(['current-active-scene']);

onMounted(() => {
    // 启动game
    game.value = StartGame('game-container-01');
    // 监听phaser里的时间，是在切场景时发的事件，在这里只是消费事件
    EventBus.on('current-scene-ready', (currentScene) => {
        // 给vue发事件。vue组件消费，是在indev.vue中使用PhaserGame时消费的
        emit('current-active-scene', currentScene);
        // 场景赋值
        scene.value = currentScene;

    });

});

onUnmounted(() => {

    if (game.value)
    {
        game.value.destroy(true);
        game.value = null;
    }

});

defineExpose({ scene, game });


</script>
<template>
  <div id="game-container-01"></div>
</template>

